<template>
  <div class="address">
    <van-nav-bar
      title="地址管理"
      left-text="返回"
      nav-bar-text-color="@white"
      left-arrow
      @click-left="onClickLeft"
    />
    <van-address-list
      v-model="chosenAddressId"
      :list="list"
      :disabled-list="disabledList"
      disabled-text="以下地址超出配送范围"
      default-tag-text="默认"
      @add="onAdd"
      @edit="onEdit"
      @select="select"
    />
  </div>
</template>

<script>
//  addressEdit
import { addressList } from "../../request/api";
export default {
  data() {
    return {
      isEdit: true,
      chosenAddressId: "1",
      useraddress: [],
      list: [
        // {
        //   id: "1",
        //   name: "张三",
        //   tel: "13000000000",
        //   address: "浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室",
        //   isDefault: true,
        // },
        // {
        //   id: "2",
        //   name: "李四",
        //   tel: "1310000000",
        //   address: "浙江省杭州市拱墅区莫干山路 50 号",
        // },
      ],
      disabledList: [
        {
          id: "3",
          name: "王五",
          tel: "1320000000",
          address: "浙江省杭州市滨江区江南大道 15 号",
        },
      ],
    };
  },
  methods: {
    onAdd() {
      this.$toast.success("新增地址");
      this.$router.push("/addressAdd");
    },
    onEdit(item, index) {
      // console.log(this.chosenAddressId);
      console.log(item);
      this.$router.push({
        path: "/addressAdd",
        query: {
          isEdit: this.isEdit,
          item,
        },
      });
      console.log(item, index);
      // if (this.chosenAddressId) {
      //   if (this.chosenAddressId - 1 === index) {
      //     let data = {
      //       id: item.id,
      //       username: item.name,
      //       userphone: item.tel,
      //       location: item.address,
      //       useraddress: this.useraddress[index],
      //       status: item.isDefault ? 1 : 0,
      //     };
      //     console.log(data);
      //     addressEdit(data).then((res) => {
      //       console.log(res);
      //       if (res.code === 200) {
      //         this.$router.push({
      //           path: "/addressAdd",
      //           query: {
      //             isEdit: this.isEdit,
      //           },
      //         });
      //       }
      //     });
      //   }
      // }
      //   this.$toast.success("编辑地址:" + index);
    },
    select(item) {
      console.log(item);
      this.event.moren = item.isDefault;
      this.event.id = item.id;
    },
    onClickLeft() {
      if (sessionStorage.getItem("path") === "/order") {
        this.$toast.success("返回到上级");
        this.$router.push("/order");
      } else if (sessionStorage.getItem("path") === "/index/mine") {
        this.$toast.success("返回到上级");
        this.$router.push("/index/mine");
      } else {
        this.$toast.success("返回到上一级");
        this.$router.back();
      }
    },
  },
  mounted() {
    if (this.$route.query.path === "order") {
      sessionStorage.setItem("path", "order");
    } else if (this.$route.query.path === "/index/mine") {
      sessionStorage.setItem("path", "/index/mine");
    }

    let uid = {
      uid: JSON.parse(sessionStorage.getItem("user")).uid,
    };
    addressList(uid).then((res) => {
      if (res.code === 200) {
        console.log(res);
        this.list = [];
        let result = res.list;
        this.useraddress = [];
        result.forEach((item) => {
          let data = {
            id: item.id,
            name: item.username,
            tel: item.userphone,
            address: item.location + " " + item.useraddress,
            isDefault: item.status ? true : false,
          };
          this.useraddress.push(item.useraddress);
          this.list.push(data);
        });
        console.log(this.useraddress);
      }
    });
 
    document.title=this.$route.meta.title
 },
};
</script>

<style scoped>
/deep/ .van-cell::after {
  border: none;
}
/* 穿透 两种方式 :/deep/  >>> */
.van-coupon-cell >>> {
  padding: 0;
}
.van-cel >>> {
  padding: 0;
}
/* * 顶部返回字体样式  */
/deep/.van-nav-bar {
  background: #ff6040;
}
/deep/ .van-nav-bar__title {
  font-size: 0.12rem;
  color: #fff;
}
/deep/ .van-nav-bar__text {
  color: #fff;
}
/deep/ .van-nav-bar__title {
  font-size: 0.18rem;
  font-weight: bold;
  color: #fff;
}
/deep/ .van-nav-bar .van-icon {
  font-size: 0.12rem;
  color: #fff;
}

/deep/ [class*="van-hairline"]::after {
  border: none;
}
/deep/ .van-nav-bar__content {
  height: 48px;
}
.address {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow-y: auto;
  background-color: #fff;
}
/deep/ .van-address-list__bottom {
  height: 0.7rem;
}
</style>